<template>
  <div ref="navBar">
    <van-nav-bar
      @click-left="clickLeft"
      :title="title.name"
      left-arrow
      left-text="返回"
      :fixed='true'
      :z-index="zIndex"
      >
      <mini-player slot="right"></mini-player>
    </van-nav-bar>
  </div>
</template>

<script>
import { NavBar } from 'vant'
import miniPlayer from './miniPlayer'
export default {
  name: 'navBar',
  props: {
    title: {
      type: Object,
      default () {
        return {
          name: ''
        }
      }
    }
  },
  data() {
    return {
      true: true,
      zIndex: 2
    }
  },
  components: {
    [NavBar.name]: NavBar,
    miniPlayer
  },
  methods: {
    clickLeft() {
      this.$router.back()
    }
  }
}
</script>

<style>
.van-nav-bar .van-icon,.van-nav-bar__text {
    color: black!important;
}
</style>
